<script>

export default {
  name: "App"
}
</script>

<template>
  <div>
<!--    <nav>-->
      <!--    1-字符串（路由地址）        -->
      <!--            <router-link to="/">首页</router-link>|-->
      <!--            <router-link to="/goodsList">商品列表</router-link>|-->
      <!--            <router-link to="/newsList">新闻列表</router-link>|-->
      <!--            <router-link to="/my">我的个人中心</router-link>-->

      <!--   2-对象(path---路由信息中的path属性值)-->
                  <router-link :to="{path:'/'}">首页</router-link>|
                  <router-link :to="{path:'/goodsList'}">商品列表</router-link>|
                  <router-link :to="{path:'/newsList'}">新闻列表</router-link>|
                  <router-link :to="{path:'/my'}">我的个人中心</router-link>

      <!--   3-对象(name----路由信息中的name属性值)         -->
<!--      <router-link :to="{name:'home'}">首页</router-link>|-->
<!--      <router-link :to="{name:'goods'}">商品列表</router-link>|-->
<!--      <router-link :to="{name:'news'}">新闻列表</router-link>|-->
<!--      <router-link :to="{name:'my'}">我的个人中心</router-link>-->
<!--    </nav>-->
    <!--  components->属性名字为One的路由组件      -->
    <router-view name="One"></router-view>
    <!--  components->属性名字为Two的路由组件      -->
    <router-view name="Two"></router-view>
    <!--  components->属性名字为default的路由组件 或 component指定的路由组件      -->
    <router-view></router-view>
  </div>
</template>

<style scoped>

</style>